<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:f="http://java.sun.com/jsf/core"
      xmlns:c="http://java.sun.com/jsp/jstl/core"
      xmlns:ui="http://java.sun.com/jsf/facelets"
      xmlns:a4j="http://richfaces.org/a4j"
      xmlns:rich="http://richfaces.org/rich">
    <h:head>
        <title>Player List</title>
        <h:outputStylesheet name="../css/global.css"/>
        <script src="http://code.jquery.com/jquery-latest.js"/>
        <h:outputScript name="../js/global.js"/>
        <!-- jquery DataTable !-->
        <h:outputStylesheet name="DataTables-1.9.4/media/css/jquery.dataTables.css"/>
        <h:outputScript name="DataTables-1.9.4/media/js/jquery.js"/>
        <h:outputScript name="DataTables-1.9.4/media/js/jquery.dataTables.js"/>
        <script language="javascript">
            $(document).ready(function(){
                $("[id$='playerTable']").dataTable({
                });
                $("div.navy").load("navy.xhtml");
                
                //var message = $('#message').text();
                //alert(message);
            });
        </script>
    </h:head>
    <h:body>
        <div id="background">
            <div class="navy">
            </div>
            <div id="content">
                <div id="playerListDiv">
                    
                    <h:form>
                        
                        <f:view>

                            <span class="whiteHeader">Player List</span><br/><div style="color: #ffffff">#{rosterBean.message}</div><br/>
                            <h:dataTable id="playerTable" value="#{rosterBean.playerList}" var="item">
                                <h:column>
                                    <f:facet name="header">
                                        <h:outputText value=""/>
                                    </f:facet>
                                    <h:commandButton value="ADD" action="#{rosterBean.addPlayer}" >
                                        <f:param name="action" value="#{item.id}" />
                                    </h:commandButton>

                                </h:column>
                                <h:column>
                                    <f:facet name="header">
                                        <h:outputText value="Id"/>
                                    </f:facet>
                                    <h:outputText value="#{item.id}"/>
                                </h:column>
                                <h:column>
                                    <f:facet name="header">
                                        <h:outputText value="FirstName"/>
                                    </f:facet>
                                    <h:outputText value="#{item.firstName}"/>
                                </h:column>
                                <h:column>
                                    <f:facet name="header">
                                        <h:outputText value="LastName"/>
                                    </f:facet>
                                    <h:outputText value="#{item.lastName}"/>
                                </h:column>
                                <h:column>
                                    <f:facet name="header">
                                        <h:outputText value="Position"/>
                                    </f:facet>
                                    <h:outputText value="#{item.position}"/>
                                </h:column>
                                <h:column>
                                    <f:facet name="header">
                                        <h:outputText value="Number"/>
                                    </f:facet>
                                    <h:outputText value="#{item.number}"/>
                                </h:column>
                                <h:column>
                                    <f:facet name="header">
                                        <h:outputText value="Status"/>
                                    </f:facet>
                                    <h:outputText value="#{item.status}"/>
                                </h:column>
                                <h:column>
                                    <f:facet name="header">
                                        <h:outputText value="Height"/>
                                    </f:facet>
                                    <h:outputText value="#{item.height}"/>
                                </h:column>
                                <h:column>
                                    <f:facet name="header">
                                        <h:outputText value="Weight"/>
                                    </f:facet>
                                    <h:outputText value="#{item.weight}"/>
                                </h:column>
                                <h:column>
                                    <f:facet name="header">
                                        <h:outputText value="Age"/>
                                    </f:facet>
                                    <h:outputText value="#{item.age}"/>
                                </h:column>
                                <h:column>
                                    <f:facet name="header">
                                        <h:outputText value="BirthDate"/>
                                    </f:facet>
                                    <h:outputText value="#{item.birthDate}">
                                        <f:convertDateTime pattern="MM/dd/yyyy" />
                                    </h:outputText>
                                </h:column>
                                <h:column>
                                    <f:facet name="header">
                                        <h:outputText value="College"/>
                                    </f:facet>
                                    <h:outputText value="#{item.college}"/>
                                </h:column>
                                <h:column>
                                    <f:facet name="header">
                                        <h:outputText value="ExperienceYears"/>
                                    </f:facet>
                                    <h:outputText value="#{item.experienceYears}"/>
                                </h:column>
                                <h:column>
                                    <f:facet name="header">
                                        <h:outputText value="HighSchool"/>
                                    </f:facet>
                                    <h:outputText value="#{item.highSchool}"/>
                                </h:column>
                                <h:column>
                                    <f:facet name="header">
                                        <h:outputText value="PhotoURL"/>
                                    </f:facet>
                                    <h:graphicImage url="#{item.photoURL}"/>
                                </h:column>
                                <h:column>
                                    <f:facet name="header">
                                        <h:outputText value="Byeweek"/>
                                    </f:facet>
                                    <h:outputText value="#{item.byeweek}"/>
                                </h:column>
                                <h:column>
                                    <f:facet name="header">
                                        <h:outputText value="Active"/>
                                    </f:facet>
                                    <h:outputText value="#{item.active}"/>
                                </h:column>
                            </h:dataTable>
                        </f:view>
                    </h:form>
                </div>
            </div>
        </div>
    </h:body>
</html>
